<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>订单</title>
    <script src="js/jquery-3.6.3.min.js"></script>
    <link rel="stylesheet" href="css/bootstrap.css">
    <link rel="stylesheet" href="css/bootstrap-theme.css">
    <script src="js/bootstrap.js"></script>
    <script>
        let order = JSON.parse(window.localStorage.getItem("order"))

        $(function (){
            $("#name").text(order.name)
            $("#price").text(order.price/100.0+"元")
            $("#count").val(order.count)
            $("#address").val(window.localStorage.getItem("address"))
            $("#email").val(window.localStorage.getItem("email"))
            $("#btnAdd").click(
                function (){
                    $.ajax({
                        url: "/order/add",
                        type: "post",
                        data: JSON.stringify({
                            "goodsid":order.goodsid,
                            "count":$("#count").val(),
                            "address":$("#address").val(),
                            "email":$("#email").val()
                        }),
                        contentType: "application/json",
                        dataType: "json",
                        success: function (data) {
                            let r = data;
                            if(r.code===1){
                                alert(r.data)
                            }
                            else{
                                alert(r.msg)
                            }
                        }
                    })
                }
            )

            $("input").attr("autocomplete", "off")
        })

    </script>
</head>
<body>
    <div class="table-responsive">
        <div class="page-header">
            <h3>
                新建订单
            </h3>
        </div>
        <table class="table table-bordered table-striped">
            <tr>
                <th>商品名</th>
                <td><label id="name"></label></td>
            </tr>
            <tr>
                <th>价格</th>
                <td><label id="price"></label></td>
            </tr>
            <tr>
                <th>购买个数</th>
                <td>
                    <input id="count" type="number" min="1" step="1">
                </td>
            </tr>
            <tr>
                <th>地址</th>
                <td>
                    <input id="address" type="text">
                </td>
            </tr>
            <tr>
                <th>邮箱</th>
                <td>
                    <input id="email" type="text">
                </td>
            </tr>
            <tr>
                <th>操作</th>
                <td>
                    <button id="btnAdd" class="btn-primary">下单</button>
                </td>
            </tr>
        </table>
    </div>

</body>
</html>